import React, { Component } from 'react'
import { TabBar } from 'antd-mobile';
import Index from './information/information'
// import Subject from './subject/subject'
import Subject from './subjectModel/sub'
import Community from './community/community' 
import Mine from './mine/mine'
import {withRouter} from 'react-router-dom'

@withRouter
export default class information extends Component {
    constructor(props) {
        super(props);
        this.state = {
            selectedTab: 'index',
            hidden: false,
            fullScreen: true,
        };
    }


    render() {
        return (
            <div style={this.state.fullScreen ? { position: 'fixed', height: '100%', width: '100%', top: 0,overflow:'hidden' } : { height: 400 }}>
                <TabBar
                    unselectedTintColor="#949494"
                    tintColor="#33A3F4"
                    barTintColor="white"
                    hidden={this.state.hidden}
                >
                    <TabBar.Item
                        title="首页"
                        key="index"
                        icon={
                            <i className="yo-ico myicon">&#xe605;</i>
                        }
                        selectedIcon={
                            <i className="yo-ico acicon">&#xe605;</i>
                        }
                        selected={this.state.selectedTab === 'index'}
                        onPress={() => {
                            this.setState({
                                selectedTab: 'index',
                            });
                            // this.props.history.push('/index')

                        }}
                        data-seed="logId"
                    >
                        <Index></Index>
                     </TabBar.Item>
                    <TabBar.Item
                        icon={
                            <i className="yo-ico myicon">&#xe6a4;</i>
                        }
                        selectedIcon={
                            <i className="yo-ico acicon">&#xe6a4;</i>
                        }
                        title="专题"
                        key="subject"
                        selected={this.state.selectedTab === 'subject'}
                        onPress={() => {
                            this.setState({
                                selectedTab: 'subject',
                            });
                        this.props.history.push('/index/subject');

                        }}
                        data-seed="logId1"
                    >
                        <Subject></Subject>
                    </TabBar.Item>
                    <TabBar.Item
                        icon={
                            <i className="yo-ico myicon">&#xe6f9;</i>
                        }
                        selectedIcon={
                            <i className="yo-ico acicon">&#xe6f9;</i>
                        }
                        title="社区"
                        key="commuity"
                        selected={this.state.selectedTab === 'commuity'}
                        onPress={() => {
                            this.setState({
                                selectedTab: 'commuity',
                            });
                            this.props.history.push('/index')
                        }}
                    >
                        <Community></Community>
                    </TabBar.Item>
                    <TabBar.Item
                        icon={
                            <i className="yo-ico myicon">&#xe622;</i>
                        }
                        selectedIcon={
                            <i className="yo-ico acicon">&#xe622;</i>
                        }
                        title="我的"
                        key="my"
                        selected={this.state.selectedTab === 'my'}
                        onPress={() => {
                            this.setState({
                                selectedTab: 'my',
                            });
                            // this.props.history.push('/index')
                        }}
                    >
                        <Mine></Mine>
          </TabBar.Item>
                </TabBar>
            </div>
        )
    }
}
